<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
   <head><title>jZebra Demo</title></head><body onLoad="displayLogo();">
   <style type="text/css">
      body {color:#335500; background-color:#ffffff; font-family:Arial, sans-serif;font-size: 12px;}
      /*a {padding:1px; border:1px solid #335500; font-family:Tahoma,sans-serif; color:#335500; background-color: #99FF00; text-decoration:none;}*/	
      a {font-family:"Courier New",Courier,monospace;text-decoration:none;font-weight:bold;}
      h1 {background-color:#CCFF99; margin:0; font-size:18px;}
      table {border:none;}
      hr {width:75%; color:#CCFF99; background-color:#CCFF99; height:5px; border:none;}
      tr {text-align: left; border:none;}
      th {font-size:24px; background-color:#CCFF99;border:none;}
      td {vertical-align:top; border:none;}
         .code {display:none; font-family:"Courier New",Courier,monospace;background-color:#E5FFCC;font-weight:bold;}
      desc th {width: 50px;}
      /*li {font-family:"Courier New",Courier,monospace;background-color:#E5FFCC;}*/
      
      
      em {margin-left: 20px; font-size: 80%;}
      
      /* Custom Alert Box -- Disabled */
      alertBg {background-color:transparent; position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:10000;}
      alertBox {opacity:.95; position:relative; width:250px; min-height:100px; margin-top:50px; border:2px solid #335500; background-color:white; background-position:20px 30px; text-align:center;}
      alertBox closeBtn {display:block; position:relative; margin:5px auto; padding:3px; border:1px solid #000; width:70px; font:0.7em verdana,arial; text-transform:uppercase;	text-align:center; color:#FFF; background-color:#78919B; text-decoration:none;}
   </style>
   <!--- jZebra's main JavaScript functions.  Use these! --> 
   <script type="text/javascript">
      var sleepCounter = 0;
      function findPrinter() {
         var applet = document.jZebra;
         if (applet != null) {
            // Searches for locally installed printer with "zebra" in the name
            applet.findPrinter(document.getElementById("printerField").value);
         }
         monitorFinding();
      }

      function findPrinters() {
         var applet = document.jZebra;
         if (applet != null) {
            // Searches for locally installed printer with "zebra" in the name
            applet.findPrinter(",");
         }
         monitorFinding2();
      }

      function print() {
         var applet = document.jZebra;
         if (applet != null) {
            // Send characters/raw commands to applet using "append"
            // Hint:  Carriage Return = \r, New Line = \n, Escape Double Quotes= \"
            // Note:  "Unescape" is optional and is used to fix "%20" type URL encoded fields
            applet.append(unescape(document.getElementById("printField").value.replace("sample.html", applet.getVersion() + " sample.html")));
            
            
            //applet.append("A590,1600,2,3,1,1,N,\"jZebra " + applet.getVersion() + " sample.html\"\n");
            //applet.append("A590,1570,2,3,1,1,N,\"Testing the print() function\"\n");
            //applet.append("P1\n");
            
            // Send characters/raw commands to printer
            applet.print();
	 }
	 
	 monitorPrinting();
         
         /**
           *  PHP PRINTING:
           *  // Uses the php `"echo"` function in conjunction with jZebra `"append"` function
           *  // This assumes you have already assigned a value to `"$commands"` with php
           *  document.jZebra.append(<?php echo $commands; ?>);
           */
           
         /**
           *  SPECIAL ASCII ENCODING
           *  //applet.setEncoding("UTF-8");
           *  applet.setEncoding("Cp1252"); 
           *  applet.append("\xDA");
           *  applet.append(String.fromCharCode(218));
           *  applet.append(chr(218));
           */
         
      }

      function print64() {
         var applet = document.jZebra;
         if (applet != null) {
            // Use jZebra's `"append64"` function. This will automatically convert provided
            // base64 encoded text into ascii/bytes, etc.
            applet.append64(document.getElementById("print64Field").value);
            
            // Send characters/raw commands to printer
            applet.print();
         }
         monitorPrinting();
      }
      
      function printPages() {
         var applet = document.jZebra;
         if (applet != null) {
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 1\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 2\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 3\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 4\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 5\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 6\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 7\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
            
            applet.append("A590,1600,2,3,1,1,N,\"jZebra 8\"\n");
            applet.append("A590,1570,2,3,1,1,N,\"Testing the printPages() function\"\n");
            applet.append("P1\n");
 
            // Mark the end of a label, in this case  P1 plus a newline character
            // jZebra knows to look for this and treat this as the end of a "page"
            // for better control of larger spooled jobs (i.e. 50+ labels)
            // i.e. applet.setEndOfDocument("P1\n");
            applet.setEndOfDocument(unescape(document.getElementById("endField").value));
            
            // The amount of labels to spool to the printer at a time. When
            // jZebra counts this many `EndOfDocument`'s, a new print job will 
            // automatically be spooled to the printer and counting will start
            // over.
            // i.e. applet.setDocumentsPerSpool("3");
            applet.setDocumentsPerSpool(document.getElementById("spoolField").value);
            
            // Send characters/raw commands to printer
            applet.print();

         }
         monitorPrinting();
      }

      function printXML() {
         var applet = document.jZebra;
         if (applet != null) {
            // Appends the contents of an XML file from a SOAP response, etc.
            // a valid relative URL or a valid complete URL is required for the XML
            // file.  The second parameter must be a valid XML tag/node containing
            // base64 encoded data, i.e. <node_1>aGVsbG8gd29ybGQ=</node_1>
            // Example:
            //     applet.appendXML("http://yoursite.com/zpl.xml", "node_1");
            //     applet.appendXML("http://justtesting.biz/jZebra/dist/epl.xml", "v7:Image");
            var field = document.getElementById("xmlField").value;
       	    field = (field.indexOf("://") == -1) ? window.location.href + "/../" + field : field;
            applet.appendXML(field, "v7:Image");
            
            // Send characters/raw commands to printer
            //applet.print(); // Can't do this yet because of timing issues with XML
         }
         
         // Monitor the append status of the xml file, prints when appending if finished
         monitorAppending();
      }
      
      function printHex() {
      	 var applet = document.jZebra;
         if (applet != null) {
            // Using jZebra's "append()" function, hexadecimanl data can be sent
            // by using JavaScript's "\x00" notation. i.e. "41 35 39 30 2c ...", etc
            // Example: 
            //     applet.append("\x41\x35\x39\x30\x2c"); // ...etc
            //	   applet.append(unescape("%41%35%39%30%2c")); // ...etc
            // 
            applet.append(unescape(document.getElementById("hexField").value));
            
            // Send characters/raw commands to printer
            applet.print();

            
         }
         
         monitorPrinting();
         
         /**
           *  CHR/ASCII PRINTING:
           *  // Appends CHR(27) + CHR(29) using `"fromCharCode"` function
           *  // CHR(27) is commonly called the "ESCAPE" character
           *  document.jZebra.append(String.fromCharCode(27) + String.fromCharCode(29));
           */
      }
      
      
      function printFile() {
      	    var applet = document.jZebra;
      	    if (applet != null) {
	       // Using jZebra's "appendFile()" function, a file containg your raw EPL/ZPL
	       // can be sent directly to the printer
	       // Example: 
	       //     applet.appendFile("http://yoursite/zpllabel.txt"); // ...etc
	       var field = document.getElementById("fileField").value;
       	       field = (field.indexOf("://") == -1) ? window.location.href + "/../" + field : field;
	       
	       applet.appendFile(field);
	       applet.print();
	    }
	    
	    monitorPrinting();
      }

      function printImage() {
            var applet = document.jZebra;
      	    if (applet != null) {
	       // Using jZebra's "appendImage()" function, a png, jpeg file
	       // can be sent directly to the printer supressing the print dialog
	       // Example:
	       //     applet.appendImage("http://yoursite/logo1.png"); // ...etc

               // Sample only: Searches for locally installed printer with "pdf" in the name
               // Can't use Zebra, because this function needs a PostScript capable printer
               applet.findPrinter("PDF");
               while (!applet.isDoneFinding()) {
                   // Wait
               }

               // Sample only: If a PDF printer isn't installed, try the Microsoft XPS Document
               // Writer'
               if (applet.getPrinterName() == null) {
                   applet.findPrinter("Microsoft XPS Document Writer");
                   while (!applet.isDoneFinding()) {
                        // Wait
                   }
               }

               // No suitable printer found, exit
               if (applet.getPrinterName() == null) {
                   alert("Could not find a suitable printer for images");
                   return;
               }

               // Append our image (only one image can be appended per print)
               var field = document.getElementById("imageField").value;
       	       field = (field.indexOf("://") == -1) ? window.location.href + "/../" + field : field;
	       
	       applet.appendImage(field);
	    }

            // Very important for images, uses printPS() insetad of print()
	    monitorAppending2();
      }
      
      function chr(i) {
         return String.fromCharCode(i);
      }
      
      function monitorFinding() {
      	      monitorApplet('isDoneFinding()', 'alert("Found printer [" + document.jZebra.getPrinter() + "]")', 'monitor finding job');
      }
      
      function monitorPrinting() {
      	      //"alert\(\"Data sent to printer successfully\"\)"
      	      monitorApplet("isDonePrinting()", 'alert("Data sent to printer [" + document.jZebra.getPrinter() + "] successfully.")', "monitor printing job");
      }
      
      /**
       * Monitors the Java applet until it is complete with the specified function
       *    appletFunction:  should return a "true" or "false"
       *    finishedFunction:  will be called if the function completes without error
       *    description:  optional description for errors, etc
       *
       * Example:
       *    monitorApplet('isDoneFinding()', 'alert(\\"Success\\")', '');
       */
      function monitorApplet(appletFunction, finishedFunction, description) {
      	var NOT_LOADED = "jZebra hasn't loaded yet.";
      	var INVALID_FUNCTION = 'jZebra does not recognize function: "' + appletFunction; + '"';
      	var INVALID_PRINTER = "jZebra could not find the specified printer";
      	if (document.jZebra != null) {
      		var finished = false;
      		try {
      		   finished = eval('document.jZebra.' + appletFunction);
      		} catch (err) {
      		   alert('jZebra Exception:  ' + INVALID_FUNCTION);
      		   return;
      		}
	   if (!finished) {
	      window.setTimeout('monitorApplet("' + appletFunction + '", "' + 
	      	      finishedFunction.replace(/\"/g,'\\"') + '", "' + description + '")', 100);
	   } else {
	   	var p = document.jZebra.getPrinterName();
	   	if (p == null) {
	   		alert("jZebra Exception:  " + INVALID_PRINTER);
	   		return;
	   	}
		var e = document.jZebra.getException();
	      	if (e != null) {
	      		var desc = description == "" ? "" : " [" + description + "] ";
	      		alert("jZebra Exception: " + desc + document.jZebra.getExceptionMessage());
	      		document.jZebra.clearException();
	   	} else {
	   		eval(finishedFunction);
	   	}
	   }
	} else {
	   alert("jZebra Exception:  " + NOT_LOADED);
	}
      }
      
      // Used to show/hide code snippets on sample.html page
      function showHide(row){  
      	var elem = document.getElementById(row);
        elem.style.display = (elem.style.display == "table-row")?"none":"table-row";  
        var link = document.getElementById(row + "_link");
        link.innerHTML = (elem.style.display == "none") ? 
           link.innerHTML.replace("-", "+").replace("hide", "show") : 
           link.innerHTML.replace("+", "-").replace("show", "hide");
      } 
      
      /*function monitorPrinting() {
	var applet = document.jZebra;
	if (applet != null) {
	   if (!applet.isDonePrinting()) {
	      window.setTimeout('monitorPrinting()', 100);
	   } else {
	      var e = applet.getException();
	      alert(e == null ? "Printed Successfully" : "Exception occured: " + e.getLocalizedMessage());
	   }
	} else {
            alert("Applet not loaded!");
        }
      }*/
      
      /*function monitorFinding() {
	var applet = document.jZebra;
	if (applet != null) {
	   if (!applet.isDoneFinding()) {
	      window.setTimeout('monitorFinding()', 100);
	   } else {
	      var printer = applet.getPrinterName();
              alert(printer == null ? "Printer not found" : "Printer \"" + printer + "\" found");
	   }
	} else {
            alert("Applet not loaded!");
        }
      }*/

      function monitorFinding2() {
	var applet = document.jZebra;
	if (applet != null) {
	   if (!applet.isDoneFinding()) {
	      window.setTimeout('monitorFinding2()', 100);
	   } else {
	   	   var listing = applet.getPrinters();
	   	   var printers = listing.split(',');
	   	   for(var i in printers){
	   	   	   document.getElementById("printersList").options[i]=new Option(printers[i]);
                           //alert(printers[i]);
              	   }
	   }
	} else {
            alert("Applet not loaded!");
        }
      }
      
      function monitorAppending() {
	var applet = document.jZebra;
	if (applet != null) {
	   if (!applet.isDoneAppending()) {
	      window.setTimeout('monitorAppending()', 100);
	   } else {
	      applet.print(); // Don't print until all of the data has been appended
              monitorPrinting();
	   }
	} else {
            alert("Applet not loaded!");
        }
      }

      function monitorAppending2() {
	var applet = document.jZebra;
	if (applet != null) {
	   if (!applet.isDoneAppending()) {
	      window.setTimeout('monitorAppending2()', 100);
	   } else {
	      applet.printPS(); // Don't print until all of the image data has been appended
              monitorPrinting();
	   }
	} else {
            alert("Applet not loaded!");
        }
      }
      
      function monitorLoading() {
      	var applet = document.jZebra;
	if (document.jZebra != null) {
	   try {
	      if (document.jZebra.isActive()) {
	      	    document.getElementById("version").innerHTML = "<strong>Status:</strong>  jZebra " + applet.getVersion() + " loaded.";
	         if (navigator.appName=="Microsoft Internet Explorer") { // IE Fix
	            document.getElementById("logo").src="http://jzebra.googlecode.com/files/logo_small.png"
	         } else { // Use embedded logo
	            document.getElementById("logo").src=""; 
	         }
	      }
	   } catch (err) {
	      // Firefox fix
	      window.setTimeout("monitorLoading()", 500);
	   }  
	} else {
            window.setTimeout("monitorLoading()", 100);
        }
      }
     
      function displayLogo() {
	      if (navigator.appName=="Microsoft Internet Explorer") { // IE Fix
		 document.getElementById("logo").src="http://jzebra.googlecode.com/files/logo_small.gif"
	      } else { // Use embedded logo
		 document.getElementById("logo").src="";
	      }
	      monitorLoading();
      }
      
// Custom Alert Message
/*if(document.getElementById) {
  window.alert = function(txt) {
    createCustomAlert(txt);
  }
}

function createCustomAlert(txt) {
   d = document;
   if(d.getElementById("alertBg")) return;
   mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
   mObj.id = "alertBg";
   mObj.style.height = document.documentElement.scrollHeight + "px";
   alertObj = mObj.appendChild(d.createElement("div"));
   alertObj.id = "alertBox";
   // MSIE doesnt treat position:fixed correctly, so this compensates for positioning the alert
   if(d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
   // center the alert box
   alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth)/2 + "px";
   h1 = alertObj.appendChild(d.createElement("h1"));
   h1.appendChild(d.createTextNode("Status"));
   // create a paragraph element to contain the txt argument
   msg = alertObj.appendChild(d.createElement("p"));
   msg.innerHTML = txt;
   // create an anchor element to use as the confirmation button.
   //btn = alertObj.appendChild(d.createElement("input"));
   btn = alertObj.appendChild(d.createElement("a"));
   //btn.class = "input";
   //btn.setAttribute("type", "button");
   //btn.type = "button";
   //btn.value = "     Ok     ";
   //btn.setAttribute("value", "     Ok     ");
   //btn.setAttribute ("name","     Ok     ");
   //btn.setAttribute ("text","     Ok     ");
   //btn.setAttribute("style", "align:center");
   btn.appendChild(d.createTextNode("\u00A0\u00A0\u00A0\u00A0\u00A0Ok\u00A0\u00A0\u00A0\u00A0\u00A0"));
   //btn.setAttribute ("width","200px");
   btn.href = "#";
   // set up the onclick event to remove the alert when the anchor is clicked
   btn.onclick = function() { removeCustomAlert();return false; }
}

// removes the custom alert from the DOM
function removeCustomAlert() {
  document.getElementsByTagName("body")[0].removeChild(document.getElementById("alertBg"));
}*/


   </script>
   <div align=center>
      <img id="logo" src="" alt=""> 
      <p id="version"><strong>Status:</strong>  Determining jZebra version. Please wait...</p>
      <hr/>
      <applet name="jZebra" code="jzebra.PrintApplet.class" alt="jZebra did not load properly" archive="./jzebra.jar" width="0" height="0">
         <param name="printer" value="zebra">
      </applet><br><br>
      <table>
	<tr>
	<th>Function</th><th>Button</th><th>Parameter</th><th>Description</th></tr>
	<tr>
	<td><a class="sh" id="find_link" href="javascript:showHide('find')">[+]</a> Detect Printer</td>
	<td><input type="button" onClick="findPrinter()" value="Click Here"></td>
	<td><input id="printerField" type="text" size=25 value="zebra"></td>
	<td width=300px>Searches for locally installed printer with "zebra" in the name.</td>
	</tr>
	
	<tr class="code" id="find">
	<td>findPrinter();</td><td /><td /><td>document.jZebra.findPrinter("zebra");</td>
	</tr>
	
	
	<tr>
	<td><a class="sh" id="print_link" href="javascript:showHide('print')">[+]</a> Print</td>
	<td><input type="button" onClick="print()" value="Click Here"></td>
	<td><input id="printField" type="text" size=25 value="A590,1600,2,3,1,1,N,%22jZebra sample.html%22%0AA590,1570,2,3,1,1,N,%22Testing the print() function%22%0AP1%0A"></td>
	<td>Standard function for sending plain text commands to printer</td>
	</tr>
	
	<tr class="code" id="print">
	<td>print();</td><td /><td /><td>document.jZebra.append("A590,1600,...");<br />document.jZebra.print();</td>
	</tr>
	
	<tr>
	<td><a class="sh" id="base64_link" href="javascript:showHide('base64')">[+]</a> Print Base64</td>
	<td><input type="button" onClick="print64()" value="Click Here"></td>
	<td><input id="base64Field" type="text" size=25 value="QTU5MCwxNjAwLDIsMywxLDEsTiwialplYnJhIHNhbXBsZS5odG1sIgpBNTkwLDE1NzAsMiwzLDEsMSxOLCJUZXN0aW5nIHRoZSBwcmludDY0KCkgZnVuY3Rpb24iClAxCg=="></td>
	<td>Decodes base64 commands and sends to printer</td>
	</tr>
	
	<tr class="code" id="base64">
	<td>print64();</td><td /><td /><td>document.jZebra.append64("QTU5MCwxNjAwLDI...");<br />document.jZebra.print();</td>
	</tr>
	
	<tr>
	<td>Print Spooling Every 3</td>
	<td><input type="button" onClick="printPages()" value="Click Here"></td>
	<td><input id="endField" type="text" size=16 value="P1%0A">&nbsp;<input id="spoolField" type="text" size=4 value="3"></td>
	</tr>
	
	<tr>
	<td>Print XML</td>
	<td><input type="button" onClick="printXML()" value="Click Here"></td>
	<td><input id="xmlField" type="text" size=25 value="zpl.xml"></td>
	</tr>
	
	<tr>
	<td>Print Hex</td>
	<td><input type="button" onClick="printHex()" value="Click Here"></td>
	<td><input id="hexField" type="text" size=25 value="%41%35%39%30%2c%31%36%30%30%2c%32%2c%33%2c%31%2c%31%2c%4e%2c%22%6a%5a%65%62%72%61%20%73%61%6d%70%6c%65%2e%68%74%6d%6c%22%0A%41%35%39%30%2c%31%35%37%30%2c%32%2c%33%2c%31%2c%31%2c%4e%2c%22%54%65%73%74%69%6e%67%20%74%68%65%20%70%72%69%6e%74%48%65%78%28%29%20%66%75%6e%63%74%69%6f%6e%22%0A%50%31%0A"></td>
	</tr>
	
	
	<tr>
	<td>Print File</td>
	<td><input type="button" onClick="printFile()" value="Click Here"></td>
	<td><input id="fileField" type="text" size=25 value="zpl.txt"></td>
	</tr>
	
	<tr>
	<td>Print Image</td>
	<td><input type="button" onClick="printImage()" value="Click Here"></td>
	<td><input id="imageField" type="text" size=25 value="logo.jpg"></td>
	</tr>
	
	<tr>
	<td>List All Printers</td>
	<td><input type="button" onClick="findPrinters()" value="Click Here"></td>
	<td><select id="printersList"><option><-- Click Button</option></select></td>
	</tr>
      </table>
      <hr/>
      <table>
	<tr><td><ul>
	<li>To download the latest version, <a href="http://code.google.com/p/jzebra/downloads/list?q=label:Featured">click here to download</a></li>
	<li>To see the entire source code of this page, <input type="button" onClick='window.location ="view-source:" + window.location.href' value="click here to view source"></li>
	<li>If the applet loads above, you can view it's output by <a href="http://www.java.com/en/download/help/javaconsole.xml">enabling the Java console</a> through Control Panel.</li>
	<li>To submit a bug or a feature requst <a href="http://code.google.com/p/jzebra/issues/entry">click here to submit a bug</a> (Google account required)</li>
	<li>Please copy/paste details from the <a href="http://java.com/en/download/help/javaconsole.xml">java console</a> when submitting a bug report</li>
	</ul></td></td>
      </table>
      </div>
   </body>
</html>